
import { PureComponent } from 'react';
interface Props {

}
interface State {

}
export default class MiMiniList extends PureComponent<Props, State> {
  public state: State = {
  }
  renderList = (data) => {
    let el = [];
    data.map((item, key) => {
      let {  name, num, time } = item;
      el.push(
        <div key={key} data-flex="box:mean" style={{ padding: "8px 0" }}>
          <p style={{ textAlign: "center" }}>{name}</p>
          <p style={{ textAlign: "center" }}>{num}</p>
          <p style={{ textAlign: "center" }}>{time}</p>
        </div>
      )
    })
    return el;
  }
  render() {
    let data = [
      { id: 0, name: "房间太脏了", num: "1234", time: "1h" },
      { id: 1, name: "地板有点滑", num: "22", time: "1h" },
      { id: 2, name: "窗户没有", num: "567", time: "1h" },
      { id: 3, name: "窗户没有关", num: "567", time: "2h" },
      { id: 4, name: "没有关紧窗户", num: "567", time: "3h" },
      { id: 5, name: "关紧窗户", num: "567", time: "4h" }]
    return (
      <div>
        <div data-flex="box:mean cross:center" style={{ height: "30px", borderBottom: "1px solid #e8e8e8" }}>
          <p style={{ textAlign: "center" }}>name</p>
          <p style={{ textAlign: "center" }}>num</p>
          <p style={{ textAlign: "center" }}>time</p>
        </div>
        {this.renderList(data)}
      </div>
    )
  }
}